﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>吟风极客导航-很方便很有范的导航站</title>
    <meta name="keywords" content="吟风,吟风极客,吟风极客导航,web前端导航,it导航">
    <meta name="description" content="且闻细水轻吟，一袖任风凭。">
    <link rel="shortcut icon" href="favicon.ico">
    <link rel="stylesheet" href=" css/iconfont.css">
    <link rel="stylesheet" href="../plug-in/normalize.css">
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="./css/font-awesome.min.css">
</head>

<body>
    <div class="container" id="container">
        <aside class="left-bar" id="leftBar">
            <div class="title">
                <div style="float:left;clear:both;margin:6px 10px 10px 25px;"><img src="./img/favcion1.png" style="text-align:center;"></div>
                <span><b>吟风极客导航</b></span>
            </div>
            <nav class="nav">
                <div class="item active"><a href="http://bencky.ml/web/index"><i class="iconfont icon-daohang2"></i><b>吟风导航</b></a><i class="line"></i></div>
                <ul class="nav-item" id="navItem">
                    <!--https://www.bootcss.com/p/font-awesome/--><!--官方图标库-->
                    <li><a href="#game"><i class="FontAwesome icon-user-md icon-large"></i> 编程游戏</a></li>
                    <li><a href="#bbs" class="active"><i class="iconfont icon-shequ"></i>开发社区</a></li>
                    <li><a href="#sill"><i class="iconfont icon-blogger"></i>技术博客</a></li>
                    <li><a href="#docs"><i class="iconfont icon-wendangdocument78"></i>开发文档</a></li>
                    <li><a href="#tools"><i class="iconfont icon-tool"></i>实用工具</a></li>
                    <li><a href="#design"><i class="iconfont icon-designer"></i>设计资源</a></li>
                    <li><a href="#study"><i class="iconfont icon-xuexi1"></i>学无止境</a></li>
                    <li><a href="#operation"><i class="iconfont icon-yunying"></i>网络运营</a></li>
                    <li class="download"><a href="#暂时未上传下载地址"><i class="icon-github icon-large"></i> 源码下载</a></li>
                    <!--li class="download"><a href="#暂时未上传下载地址"><i class="iconfont icon-github"></i>源码下载</a></li>-->
                    <div class="cn">
                        <div class="item active"><a href="#chat"><i class="iconfont icon-liuyan"></i><b>在线客服</b></a><i class="line"></i></div>
                        <p>
                            <a target="_blank" href="http://sighttp.qq.com/authd?IDKEY=7dfda399f536c5e92014eaf37fba8c140e8efc88f0e4efe1">
                                <img border="0" src="./img/qqchat.png" alt="在线QQ交谈" title="点击这里给我发消息" /><!--http://wpa.qq.com/pa?p=2:757490662:51-->
                            </a>
                        </p>
                    </div>
                </ul>
                <div class="item comment">
                    <a target="_blank" href="http://mail.qq.com/cgi-bin/qm_share?t=qm_mailme&email=YwEGDQAIGlJTUlQjEhJNAAwO" style="text-decoration:none;">
                        <!--<i class="iconfont icon-liuyan"></i>-->
                        <img src="http://rescdn.qqmail.com/zh_CN/htmledition/images/function/qm_open/ico_mailme_01.png" />
                    </a>
                </div>
            </nav>
        </aside>

        <section class="main">
            <div id="mainContent">
                <!-- 手机端菜单 -->
                <div id="menu-box">
                    <div id="menu">
                        <input type="checkbox" id="menu-form">
                        <label for="menu-form" class="menu-spin">
                            <div class="line diagonal line-1"></div>
                            <div class="line horizontal"></div>
                            <div class="line diagonal line-2"></div>
                        </label>
                    </div>
                </div>
            </div>
            <!-- 编程游戏 -->
            <div class="box">
                <a href="#" name="game"></a>
                <div class="sub-category">
                    <div><i class="FontAwesome icon-user-md icon-large"></i>编程游戏</div>
                </div>
                <div>
                    <a target="_blank" href="http://www.codingame.com/">
                        <div class="item">
                            <div class="logo"><img src="img/codinggames.png" alt="Coding Games"> Coding Games</div>
                            <div class="desc">一边玩游戏,一边挑战编程难题。支持包括PHP,C,JavaScript在内的20多种编程语言</div>
                        </div>
                    </a>
                </div>
                <div>
                    <a target="_blank" href="https://codecombat.com/">
                        <div class="item">
                            <div class="logo"><img src="img/jike.jpg" alt="CodeCombat（极客战记）"> CodeCombat(极客战记)</div>
                            <div class="desc">一款网页编程游戏,能够学习 Python、JavaScript等语言</div>
                        </div>
                    </a>
                </div>
                <div>
                    <a target="_blank" href="https://screeps.com/">
                        <div class="item">
                            <div class="logo"><img src="img/screeps.jpg" alt="Screeps"> Screeps</div>
                            <div class="desc">Screeps是一个为JavaScript程序员准备的大型多人在线游戏(MMO)</div>
                        </div>
                    </a>
                </div>
                <div>
                    <a target="_blank" href="https://checkio.org/">
                        <div class="item">
                            <div class="logo"><img src="img/checkio.png" alt="Checkio"> Checkio</div>
                            <div class="desc">一个基于浏览器的游戏,你需要使用Python或JavaScript来解决问题才能将游戏进行下去</div>
                        </div>
                    </a>
                </div>
                <div>
                    <a target="_blank" href="https://vim-adventures.com/">
                        <div class="item">
                            <div class="logo"><img src="img/vim.png" alt="Vim Adventures"> Vim Adventures</div>
                            <div class="desc">顾名思义，这个网站让你通过玩游戏来学习 Vim</div>
                        </div>
                    </a>
                </div>
                <div>
                    <a target="_blank" href="https://www.cyber-dojo.org/">
                        <div class="item">
                            <div class="logo"><img src="img/cyber-dojo.png" alt="Cyber Dojo"> Cyber Dojo</div>
                            <div class="desc">提供给程序员们练习写程序的地方。支持JavaScript、Java、Python、PHP、Ruby等语言</div>
                            <!--源代码：https://github.com/JonJagger/cyber-dojo-->
                        </div>
                    </a>
                </div>
                <div>
                    <a target="_blank" href="https://www.codemonkey.com/hk/">
                        <div class="item">
                            <div class="logo"><img src="img/codemonkey.png" alt="Code Monkey"> Code Monkey</div>
                            <div class="desc">非常富有童趣的网页编程游戏，玩家通过编程向怪兽小猴子传达指令，帮助小猴子吃到香蕉就可以过关了</div>
                        </div>
                    </a>
                </div>
                <div>
                    <a target="_blank" href="http://play.elevatorsaga.com/">
                        <div class="item">
                            <div class="logo"><img src="img/es.png" alt="Elevator Saga"> Elevator Saga</div>
                            <div class="desc">JavaScript电梯编程游戏，需要一步步解决问题过关。比如说第一关是在60秒内运输15个人</div>
                            <!--源代码：https://github.com/magwo/elevatorsaga-->
                        </div>
                    </a>
                </div>
                <div>
                    <a target="_blank" href="https://www.codewars.com/">
                        <div class="item">
                            <div class="logo"><img src="img/codewars.png" alt="Codewars"> Codewars</div>
                            <div class="desc">在战斗中进行学习,和其他人一起在真实的编程挑战中提升技巧,支持JavaScript、Python、C#、Java、Python等语言</div>
                        </div>
                    </a>
                </div>
                <div>
                    <a target="_blank" href="http://rubyquiz.com/">
                        <div class="item">
                            <div class="logo"><img src="img/rubyquiz.png" alt="Ruby Quiz"> Ruby Quiz</div>
                            <div class="desc">面向Ruby程序员的每周编程挑战项目,目前有156个测验项目</div>
                        </div>
                    </a>
                </div>
                <div>
                    <a target="_blank" href="https://vim-adventures.com/">
                        <div class="item">
                            <div class="logo"><img src="img/vim.png" alt="Vim Adventures"> Vim Adventures</div>
                            <div class="desc">顾名思义，这个网站让你通过玩游戏来学习 Vim</div>
                        </div>
                    </a>
                </div>
            </div>
            <!-- 开发社区 -->
            <div class="box">
                <a href="#" name="bbs"></a>
                <div class="sub-category">
                    <div><i class="iconfont icon-shequ"></i>开发社区</div>
                </div>
                <div>
                    <a target="_blank" href="http://blog.csdn.net/">
                        <div class="item">
                            <div class="logo"><img src="img/csdn.ico" alt="CNDS"> CNDS</div>
                            <div class="desc">中国最大的IT社区和服务平台</div>
                        </div>
                    </a>
                    <a target="_blank" href="https://juejin.im/">
                        <div class="item">
                            <div class="logo"><img src="img/gold-favicon.png" alt="掘金"> 掘金</div>
                            <div class="desc">只有高手分享的中文技术社区</div>
                        </div>
                    </a>
                    <a target="_blank" href="https://github.com/">
                        <div class="item">
                            <div class="logo"><img src="img/github.ico" alt="github"> github</div>
                            <div class="desc">面向开源及私有软件项目的git托管平台</div>
                        </div>
                    </a>
                    <a target="_blank" href="http://stackoverflow.com/">
                        <div class="item">
                            <div class="logo"><img src="img/stackoverflow.ico" alt="stackoverflow"> stackoverflow</div>
                            <div class="desc">国外编程相关的IT技术问答网站</div>
                        </div>
                    </a>
                    <a target="_blank" href="https://segmentfault.com/">
                        <div class="item">
                            <div class="logo"><img src="img/segmentfault.ico" alt="segmentfault"> segmentfault</div>
                            <div class="desc">一个专注于解决编程问题，提高开发技能的社区。</div>
                        </div>
                    </a>
                    <a target="_blank" href="https://www.zhihu.com/">
                        <div class="item">
                            <div class="logo"><img src="img/zhihu.ico" alt="知乎"> 知乎</div>
                            <div class="desc">与世界分享你的知识、经验和见解与世界分享你的知识、经验和见解</div>
                        </div>
                    </a>
                    <a target="_blank" href="https://www.cnblogs.com/">
                        <div class="item">
                            <div class="logo"><img src="img/cnblogs.ico" alt="博客园"> 博客园</div>
                            <div class="desc">博客模式的技术分享社区</div>
                        </div>
                    </a>
                    <a target="_blank" href="https://www.oschina.net/">
                        <div class="item">
                            <div class="logo"><img src="img/oschina.ico" alt="开源中国"> 开源中国</div>
                            <div class="desc">
                                <div class="info">目前中国最大的开源技术社区</div>
                            </div>
                        </div>
                    </a>
                    <a target="_blank" href="https://www.v2ex.com/">
                        <div class="item">
                            <div class="logo"><img src="img/v2ex.png" alt="V2EX"> V2EX</div>
                            <div class="desc">一个关于分享和探索的地方。</div>
                        </div>
                    </a>
                    <a target="_blank" href="https://coding.net/">
                        <div class="item">
                            <div class="logo"><img src="img/coding.png" alt=" Coding"> Coding</div>
                            <div class="desc">中国最大的git平台。</div>
                        </div>
                    </a>
                </div>
            </div>
            <!-- 技术博客 -->
            <div class="box">
                <a href="#" name="sill"></a>
                <div class="sub-category">
                    <div><i class="iconfont icon-blogger"></i>技术博客</div>
                </div>
                <div>
                    <a target="_blank" href="http://www.alloyteam.com/">
                        <div class="item">
                            <div class="logo"><img src="img/alloyteam-favicon.jpg" alt="腾讯 AlloyTeam 团队"> 腾讯 AlloyTeam 团队</div>
                            <div class="desc">腾讯Web前端团队，代表作品WebQQ，致力于前端技术的研究</div>
                        </div>
                    </a>
                    <a target="_blank" href="https://isux.tencent.com/">
                        <div class="item">
                            <div class="logo"><img src="img/isux-favicon.jpg" alt="ISUX"> ISUX</div>
                            <div class="desc">腾讯社交用户体验设计，简称ISUX，腾讯设计团队网站</div>
                        </div>
                    </a>
                    <a target="_blank" href="http://fex.baidu.com/">
                        <div class="item">
                            <div class="logo"><img src="img/fex-favicon.png"> FEX </div>
                            <div class="desc">百度Web前端研发部出品</div>
                        </div>
                    </a>
                    <a target="_blank" href="http://taobaofed.org/">
                        <div class="item">
                            <div class="logo"><img src="img/fed-favicon.png"> 淘宝前端团队（FED）</div>
                            <div class="desc">用技术为体验提供无限可能</div>
                        </div>
                    </a>
                    <a target="_blank" href="https://aotu.io/">
                        <div class="item">
                            <div class="logo"><img src="img/aotu-favicon.png"> 凹凸实验室 </div>
                            <div class="desc">京东用户体验设计部出品</div>
                        </div>
                    </a>
                    <a target="_blank" href="https://75team.com/">
                        <div class="item">
                            <div class="logo"><img src="img/75team-favicon.png"> 奇舞团 </div>
                            <div class="desc">奇虎360旗下前端开发团队出品</div>
                        </div>
                    </a>
                    <a target="_blank" href="http://efe.baidu.com/">
                        <div class="item">
                            <div class="logo"><img src="img/efe-favicon.png"> EFE </div>
                            <div class="desc">由百度多个遵循统一技术体系的前端团队所组成</div>
                        </div>
                    </a>
                </div>
            </div>
            <!-- 参考文档 -->
            <div class="box">
                <a href="" name="docs"></a>
                <div class="sub-category">
                    <div><i class="iconfont icon-wendangdocument78"></i>参考文档</div>
                </div>
                <div>
                    <a target="_blank" href="http://jquery.cuishifeng.cn/index.html">
                        <div class="item">
                            <div class="logo"><img src="img/jquery.png" alt="jQuery"> jQuery</div>
                            <div class="desc">优秀的JavaScript代码库</div>
                        </div>
                    </a>
                    <a target="_blank" href="http://v3.bootcss.com/">
                        <div class="item">
                            <div class="logo"><img src="img/bootstrap-favicon.png" alt="Bootstrap"> Bootstrap</div>
                            <div class="desc">基于HTML/CSS/Javscript的前端框架</div>
                        </div>
                    </a>
                    <a target="_blank" href="http://v3.bootcss.com/">
                        <div class="item">
                            <div class="logo"><img src="img/vue-favicon.png" alt="Vue.js"> Vue.js</div>
                            <div class="desc">构建数据驱动的web界面的渐进式框架</div>
                        </div>
                    </a>
                </div>
            </div>
            <!-- 实用工具 -->
            <div class="box">
                <a href="" name="tools"></a>
                <div class="sub-category">
                    <div><i class="iconfont icon-tool"></i>实用工具</div>
                </div>
                <div>
                    <a target="_blank" href="http://www.ibootstrap.cn/">
                        <div class="item">
                            <div class="no-logo">bootstrap可视化布局</div>
                        </div>
                    </a>
                    <a target="_blank" href="http://www.peise.net/tools/web/">
                        <div class="item">
                            <div class="no-logo">网页配色工具</div>
                        </div>
                    </a>
                    <a target="_blank" href="http://www.uupoop.com/">
                        <div class="item">
                            <div class="no-logo">在线PS</div>
                        </div>
                    </a>
                    <a target="_blank" href="https://dummyimage.com/">
                        <div class="item">
                            <div class="no-logo">动态图像生成器</div>
                        </div>
                    </a>
                    <a target="_blank" href="http://xiuxiu.web.meitu.com/main.html">
                        <div class="item">
                            <div class="no-logo">美图秀秀在线图片处理</div>
                        </div>
                    </a>
                    <a target="_blank" href="https://cli.im/deqr">
                        <div class="item">
                            <div class="no-logo">二维码在线生成</div>
                        </div>
                    </a>
                    <a target="_blank" href="https://www.zybuluo.com/mdeditor">
                        <div class="item">
                            <div class="no-logo">Markdown在线编辑器</div>
                        </div>
                    </a>
                    <a target="_blank" href="http://dwz.wailian.work/">
                        <div class="item">
                            <div class="no-logo">短网址生成</div>
                        </div>
                    </a>
                </div>
            </div>
            <!-- 设计资源 -->
            <div class="box">
                <a href="" name="design"></a>
                <div class="sub-category">
                    <div><i class="iconfont icon-wendangdocument78"></i>设计资源</div>
                </div>
                <div>
                    <a target="_blank" href="http://www.uigreat.com/">
                        <div class="item">
                            <div class="logo">
                                <img src="img/uigreat-favicon.jpg"> UIGREAT
                            </div>
                            <div class="desc">
                                优秀设计师的贴心伴侣。
                            </div>
                        </div>
                    </a>
                    <a target="_blank" href="http://huaban.com/">
                        <div class="item">
                            <div class="logo">
                                <img src="img/huaban-favicon.png"> 花瓣
                            </div>
                            <div class="desc">
                                花瓣，陪你做生活的设计师。
                            </div>
                        </div>
                    </a>
                    <a target="_blank" href="https://dribbble.com/">
                        <div class="item">
                            <div class="logo">
                                <img src="img/dribbble-favicon.png"> Dribbble
                            </div>
                            <div class="desc">
                                设计作品的交流平台
                            </div>
                        </div>
                    </a>
                    <a target="_blank" href="https://www.behance.net/">
                        <div class="item">
                            <div class="logo">
                                <img src="img/behance-favicon.png"> Behance
                            </div>
                            <div class="desc">
                                系列设计作品开放平台
                            </div>
                        </div>
                    </a>
                    <a target="_blank" href="https://www.pinterest.com/">
                        <div class="item">
                            <div class="logo">
                                <img src="img/pinterest-favicon.png"> Pinterest
                            </div>
                            <div class="desc">
                                图片分享类的社交网站
                            </div>
                        </div>
                    </a>
                    <a target="_blank" href="http://www.zcool.com.cn/">
                        <div class="item">
                            <div class="logo">
                                <img src="img/zcool-favicon.jpg"> 站酷
                            </div>
                            <div class="desc">
                                打开站酷,发现更好的设计!
                            </div>
                        </div>
                    </a>
                    <a target="_blank" href="https://thefwa.com/">
                        <div class="item">
                            <div class="logo">
                                <img src="img/thefwa-favicon.png"> FWA
                            </div>
                            <div class="desc">
                                互动多媒体网站收录平台
                            </div>
                        </div>
                    </a>
                </div>
            </div>
            <!-- 学无止境 -->
            <div class="box">
                <a href="#" name="study"></a>
                <div class="sub-category">
                    <div><i class="iconfont icon-xuexi1"></i>学无止境</div>
                </div>
                <div>
                    <a target="_blank" href="https://www.w3cschool.cn/">
                        <div class="item">
                            <div class="no-logo">w3cschool</div>
                            <div class="desc">学编程，从W3cschool开始</div>
                        </div>
                    </a>
                    <a target="_blank" href="https://www.imooc.com/">
                        <div class="item">
                            <div class="no-logo">慕课网</div>
                            <div class="desc">程序员的梦工厂</div>
                        </div>
                    </a>
                    <a target="_blank" href="http://study.163.com/">
                        <div class="item">
                            <div class="no-logo">网易云课堂</div>
                            <div class="desc">网易公司研发的一款大型在线教育平台服务</div>
                        </div>
                    </a>
                </div>
            </div>
            <!-- 网络运营 -->
            <div class="box">
                <a href="" name="operation"></a>
                <div class="sub-category">
                    <div><i class="iconfont icon-yunying"></i>网络运营</div>
                </div>
                <div>
                    <a target="_blank" href="https://mp.weixin.qq.com/">
                        <div class="item">
                            <div class="no-logo">微信公众平台</div>
                        </div>
                    </a>
                    <a target="_blank" href="https://www.toutiao.com/">
                        <div class="item">
                            <div class="no-logo">今日头条号</div>
                        </div>
                    </a>
                    <a target="_blank" href="https://www.jianshu.com/">
                        <div class="item">
                            <div class="no-logo">简书</div>
                        </div>
                    </a>
                    <a target="_blank" href="https://mp.dayu.com/">
                        <div class="item">
                            <div class="no-logo">UC大鱼号</div>
                        </div>
                    </a>
                    <a target="_blank" href="http://baijiahao.baidu.com/builder/author/register/index">
                        <div class="item">
                            <div class="no-logo">百度百家号</div>
                        </div>
                    </a>
                    <a target="_blank" href="https://www.weibo.com/login.php">
                        <div class="item">
                            <div class="no-logo">新浪微博</div>
                        </div>
                    </a>
                    <a target="_blank" href="https://om.qq.com/userAuth/index">
                        <div class="item">
                            <div class="no-logo">腾讯企鹅号</div>
                        </div>
                    </a>
                    <a target="_blank" href="https://www.douban.com/">
                        <div class="item">
                            <div class="no-logo">豆瓣</div>
                        </div>
                    </a>
                </div>
            </div>
            <!-- 在线客服 -->
            <!--div class="box">
                <a href="" name="chat"></a>
                <div class="sub-category">
                    <div><i class="iconfont icon-liuyan"></i>在线客服</div>
                </div>
            </div>-->
            <!-- 未完待续 -->
            <div class="box">
                <a href="" name="loading"></a>
                <div class="sub-category">
                    <div><i class="icon-spinner icon-spin icon-large"></i>未完待续（最后更新：2019.9.5）</div>
                </div>
            </div>

            <footer class="footer">
                <div class="copyright">
                    <!--<div class="container-fluid"></div>-->
                    <!--<nav> <a href="#" target="_blank">关于我们</a> <span class="pipe">|</span> <a href="#" target="_blank">联系我们</a> <span class="pipe">|</span> <a href="#" target="_blank">法律声明</a> </nav>-->
                    <div>
                        <a href="" target="_blank">关于我们</a> <span class="pipe">|</span> <a href="" target="_blank">联系我们</a> <span class="pipe">|</span> <a href="" target="_blank">法律声明</a>
                    </div>
                    <p>
                        Copyright &copy;2019- 2020. <br>
                        <a href="http://bencky.ml">吟风博客</a>&<a href="http://navigate.ym1024.com">钟储兵</a>
                    </p>
                </div>
            </footer>


            <!--<footer class="footer">
                <div class="copyright">
                    <div>
                        Copyright © 2019- 2020
                        <a href="http://bencky.ml">吟风博客</a>&<a href="http://navigate.ym1024.com">钟储兵</a>
                        <!--<a href="http://navigate.ym1024.com">极客猿梦导航 钟储兵博客</a>
                        <a href="http://www.zcbboke.com">极客猿梦导航 钟储兵博客</a>
                    </div>
                </div>
            </footer>-->
            <div id="fixedBar"><svg class="Zi Zi--BackToTop" title="回到顶部" fill="currentColor" viewBox="0 0 24 24" width="24" height="24"><path d="M16.036 19.59a1 1 0 0 1-.997.995H9.032a.996.996 0 0 1-.997-.996v-7.005H5.03c-1.1 0-1.36-.633-.578-1.416L11.33 4.29a1.003 1.003 0 0 1 1.412 0l6.878 6.88c.782.78.523 1.415-.58 1.415h-3.004v7.005z"></path></svg></div>
        </section>
        <script src="js/jquery.js"></script>
        <script>
            var oMenu = document.getElementById('menu');
            var oLeftBar = document.getElementById('leftBar');
            var menuFrom = document.getElementById('menu-form');

            oMenu.onclick = function () {
                if (oLeftBar.offsetLeft == 0) {
                    oLeftBar.style.left = -249 + 'px';
                }
                else {
                    oLeftBar.style.left = 0;
                }
            }


            // 监听页面宽度变化
            window.onresize = function () {
                judgeWidth();
                // console.log(document.documentElement.clientWidth);
            };

            // 判断页面宽度
            function judgeWidth() {
                if (document.documentElement.clientWidth > 481) {
                    oLeftBar.style.left = 0;
                } else {
                    oLeftBar.style.left = -249 + 'px';
                }
            }


            var oNavItem = document.getElementById('navItem');
            var aA = oNavItem.getElementsByTagName('a');
            for (var i = 0; i < aA.length; i++) {
                aA[i].onclick = function () {
                    for (var j = 0; j < aA.length; j++) {
                        aA[j].className = '';
                    }
                    this.className = 'active';
                    if (oLeftBar.offsetLeft == 0) {
                        if (document.documentElement.clientWidth <= 481) {
                            oLeftBar.style.left = -249 + 'px';
                            menuFrom.checked = false;

                        }
                    }
                }
            }


            $(window).scroll(function () {
                if ($(window).scrollTop() >= 200) {
                    $('#fixedBar').fadeIn(300);
                } else {
                    $('#fixedBar').fadeOut(300);
                }
            });

            $('#fixedBar').click(function () {
                $('html,body').animate({ scrollTop: '0px' }, 800);
            })

        </script>
    </div>
</body>

</html>